"""
@author: Gaoyaoxia
@date: 2021-03-12 15:40:34
"""
<!-- 联名提案 -->
<template>
  <div class="base-table-box">
    <div class="table-select-group">
      <div class="left">
        <s-select
          :selectOption="strSIds"
          v-model="params.strSId"
          style="width: 140px"
        />
        <s-select
          :selectOption="proposal.searchType3"
          v-model="params.type"
          style="width: 102px"
        ></s-select>
        <a-input
          class="search-input"
          v-model="params.search"
          placeholder="请输入搜索内容"
        />
        <a-button style="margin-left: 16px" type="primary" @click="search"
          >查询</a-button
        >
        <a-button @click="reset" class="btn-reset">重置</a-button>
      </div>
    </div>
    <a-table
      :pagination="pagination"
      :columns="columns"
      :data-source="tableData"
      :loading="loading"
      :scroll="{ x: '100%', y: '100%' }"
    >
      <template slot="caseName" slot-scope="text, record">
        <router-link
          class="link-a"
          :to="{
            path: '/cppccproposal/proposaldetail',
            query: { id: record.id }
          }"
          target="_blank"
          >{{ text }}</router-link
        >
      </template>
      <template slot="jointStatus" slot-scope="text, record">
        <span
          v-if="record.jointStatus == '不同意联名'"
          style="color: blue; cursor: pointer"
          @click="visible = true"
          >{{ text }}</span
        >
        <span v-else>{{ text }}</span>
      </template>
      <span slot="action" slot-scope="text, record">
        <div v-if="record.jointStatus == '待联名'">
          <a @click="confirmVisible = true">确认联名</a>
        </div>
      </span>
    </a-table>
    <!-- 联名意见弹窗 -->
    <a-modal
      :visible="visible"
      title="联名意见"
      width="520px"
      @cancel="visible = false"
      :footer="null"
    >
      <div class="desc-content">
        <span>不同意联名</span>
      </div>
      <div class="footer">
        <a-button type="primary" @click="visible = false">关闭</a-button>
      </div>
    </a-modal>
    <s-modal
      class="s-modal"
      :visible="confirmVisible"
      title="联名确认"
      :colon="false"
      width="600px"
      :model="form"
      @cancel="confirmVisible = false"
      @ok="onOk"
    >
      <a-form-model-item label="是否联名">
        <a-radio-group :options="options" v-model="form.isAgree" />
      </a-form-model-item>
      <a-form-model-item label="联名意见" required>
        <a-textarea
          style="height: 100px"
          placeholder="请输入联名意见"
          v-model="form.jointSuggest"
        ></a-textarea>
      </a-form-model-item>
    </s-modal>
  </div>
</template>

<script>
import paging from 'mixins/paging'
import { proposal } from 'assets/js/select-option-list'
const columns = [
  {
    title: '序号',
    dataIndex: 'key',
    width: 80
  },
  {
    title: '流水号',
    dataIndex: 'serialNum',
    width: 110
  },
  {
    title: '案号',
    dataIndex: 'caseNo',
    width: 110,
    sorter: (a, b) => a.name.length - b.name.length
  },
  {
    title: '题目',
    dataIndex: 'caseName',
    width: 280,
    ellipsis: true,
    scopedSlots: { customRender: 'caseName' }
  },
  {
    title: '提案者',
    dataIndex: 'proposer',
    width: 140
  },
  {
    title: '提案类别',
    dataIndex: 'caseType',
    width: 140
  },
  {
    title: '提交时间',
    dataIndex: 'pubDate',
    width: 200,
    sorter: (a, b) => a.name.length - b.name.length
  },
  {
    title: '联名状态',
    dataIndex: 'jointStatus',
    width: 140,
    scopedSlots: { customRender: 'jointStatus' },
    sorter: (a, b) => a.name.length - b.name.length
  },
  {
    title: '操作',
    dataIndex: 'action',
    width: 140,
    scopedSlots: { customRender: 'action' }
  }
]

export default {
  mixins: [paging],
  components: {},
  data() {
    return {
      columns,
      proposal,
      //弹窗
      visible: false,
      //查询
      strSIds: [],
      params: {
        strSId: '十四届四次',
        type: ''
      },
      //table
      tableData: [],
      loading: false,
      confirmVisible: false,
      options: [
        { label: '同意联名', value: '1' },
        { label: '不同意联名', value: '0' }
      ],
      form: {
        isAgree: '1',
        jointSuggest: ''
      }
    }
  },
  computed: {},
  watch: {},
  mounted() {},
  methods: {
    //获取列表数据
    getTableData() {
      this.tableData = [
        {
          key: 1,
          serialNum: '0013',
          caseNo: '0012',
          caseName:
            '李克强到湖北武汉考察指导新型冠状病毒感染肺炎疫情防控工作111',
          proposer: '程翔',
          caseType: '',
          pubDate: '2021-03-11 16:11',
          jointStatus: '待联名'
        },
        {
          key: 2,
          serialNum: '0013',
          caseNo: '0012',
          caseName:
            '李克强到湖北武汉考察指导新型冠状病毒感染肺炎疫情防控工作111',
          proposer: '程翔',
          caseType: '',
          pubDate: '2021-03-11 16:11',
          jointStatus: '待联名'
        },
        {
          key: 3,
          serialNum: '0013',
          caseNo: '0012',
          caseName:
            '李克强到湖北武汉考察指导新型冠状病毒感染肺炎疫情防控工作111',
          proposer: '程翔',
          caseType: '',
          pubDate: '2021-03-11 16:11',
          jointStatus: '不同意联名'
        }
      ]
      this.pagination.total = 200
    },
    //查询
    search() {},
    //重置
    reset() {
      this.params = {
        strSId: '十四届四次',
        type: ''
      }
    }
  },
  created() {}
}
</script>
<style lang='less' scoped>
/deep/.modal-form .ant-form-item {
  height: auto;
}
.desc-content {
  height: 188px;
  padding: 10px;
  font-size: 16px;
  color: #333;
}
.footer {
  text-align: center;
}
</style>